<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>工作流模型</title>
		<link rel="stylesheet" href="/fk-acti/resource/extjs6.0/classic/theme-crisp/resources/theme-crisp-all.css"></link>
		<script src="/fk-acti/resource/extjs6.0/ext-all.js"></script>
		<script src="/fk-acti/resource/extjs6.0/classic/locale/locale-zh_CN.js"></script>
		<script type="text/javascript" src="/fk-acti/web/resource/js/app.js"></script>
		<link rel="stylesheet" href="/fk-acti/web/resource/css/app.css"></link>
		<script type="text/javascript">
			var dataStore;
			dataStore = Ext.create("Ext.data.Store", {
				autoLoad: true,
				pageSize: 15,
				sorters: {
					property: "created",
					direction: "DESC"
				},
				proxy: {
					type: "ajax",
					url: "/fk-acti/modelList",
					actionMethods: {
						read: "GET" // Store设置请求的方法，与Ajax请求有区别
					},
					reader: {
						type: "json",
						rootProperty: "data", // 数据(不配置的话无法接收数据)，返回的key为data
						root: "result.list",
						totalProperty: "result.pagination.total"
					}
				},
				listeners: {
					"beforeload": function(store, op, options) {
						var params = searchFormPanel.getForm().getValues();
						Ext.apply(dataStore.proxy.extraParams, params);
					}
				}
			}); //#dataStore

			var searchFormPanel = Ext.create("Ext.form.Panel", {
				width: "100%",
				frame: true,
				title: "搜索条件",
				style: {
					marginBottom: "5px"
				},
				bodyStyle: {
					padding: "10px"
				},
				buttonAlign: "center",
				collapsible: true,
				defaultType: "textfield",
				items: [{
					xtype: "container",
					layout: "hbox",
					items: [{
							fieldLabel: "模型名称",
							labelAlign: "right",
							xtype: "textfield",
							name: "name",
						}
					]
				}, ],
				buttons: [{
					text: "搜索",
					icon: jcapp.getIcon("magnifier.png"),
					handler: function() {
						dataStore.reload();
					}
				}, {
					text: "重置",
					icon: jcapp.getIcon("arrow_refresh.png"),
					handler: function() {
						this.up("form").getForm().reset();
					}
				}]
			}); //#searchFormPanel

			var listGridPanel = Ext.create("Ext.grid.Panel", {
				title: "工作流模型列表",
				id:"aaa",
				viewConfig:{enableTextSelection:true},
				tbar: [{
							text: "新增",
							xtype: "button",
							icon: jcapp.getIcon("add.png"),
							handler: function() {
								var url = "/fk-acti/create"
								window.top.open(url);
							}
						}
				],
				dockedItems: [{
					xtype: "pagingtoolbar",
					store: dataStore, // same store GridPanel is using
					dock: "bottom",
					displayInfo: true
				}],
				store: dataStore,
				columns: [{
						header: "序号",
						xtype: "rownumberer",
						width: 60,
						align: "center"
					},
					{
						text: "模型ID",
						dataIndex: "id",
						id:"modelId",
						flex: 1
					},
					{
						text: "模型名称",
						dataIndex: "name",
						flex: 1
					},
					{
						text: "模型key",
						dataIndex: "key",
						flex: 1
					},
					{
						text: "模型版本号",
						dataIndex: "version",
						flex: 1
					},
					{
						text: "创建时间",
						dataIndex: "createTime",
						renderer: Ext.util.Format.dateRenderer('Y-m-d'),
						flex: 1
					},
					/*{
						text: "xml_id",
						dataIndex: "",
						flex: 1
					},
					{
						text: "png_id",
						dataIndex: "",
						flex: 1
					},*/
					{
						text: "部署ID",
						dataIndex: "deploymentId",
						flex: 1
					},
					{
						xtype: "actioncolumn",
						align: "center",
						text: '工作流操作',
						items: [{
								xtype: 'button',
								tooltip: '建模',
								dataIndex : 'id',
								icon: jcapp.getIcon("page_edit.png"),
								handler: function(grid, rowIndex, colIndex) {
									var rec = grid.getStore().getAt(rowIndex);
									var modelId = rec.get('id');
									var url = "/fk-acti/modeler.html?modelId=" + modelId;
									window.top.open(url);
								}
							},
							{
								xtype: "container"
							},
							/*{
								xtype: 'button',
								tooltip: '复制',
								icon: jcapp.getIcon("page_copy.png"),
								handler: function(grid, rowIndex, colIndex) {
									
								}
							},
							{
								xtype: "container"
							},*/
							{
								xtype: 'button',
								tooltip: '部署',
								icon: jcapp.getIcon("arrow_branch.png"),
								handler: function(grid, rowIndex, colIndex) {
									var rec = grid.getStore().getAt(rowIndex);
									var modelId = rec.get('id');
									myDeploy(modelId);
								}
							},
							{
								xtype: "container"
							},
							{
								xtype: 'button',
								tooltip: '查看流程图',
								icon: jcapp.getIcon("application_view_tile.png"),
								handler: function(grid, rowIndex, colIndex) {
									var rec = grid.getStore().getAt(rowIndex);
									var modelId = rec.get('id');
									getImg(modelId);
								}
							}
						]
					},
					{
						xtype: "actioncolumn",
						align: "center",
						text: '操作',
						items: [{
								xtype: 'button',
								tooltip: '删除',
								icon: jcapp.getIcon("cross.png"),
								handler: function(grid, rowIndex, colIndex) {
									var rec = grid.getStore().getAt(rowIndex);
									var modelId = rec.get('id');
									myDel(modelId);
								}
							},
						]
					}
				]
			}); //#listGridPanel

			Ext.onReady(function() {
				searchFormPanel.render(Ext.getBody());
				listGridPanel.render(Ext.getBody());
			});
		</script>
	</head>
	<body>
	
	<script type="text/javascript" src="./delete.js"></script>
	<script type="text/javascript" src="./deploy.js"></script>
	<script type="text/javascript" src="./getImg.js"></script>
	</body>
</html>